<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      lang="zh-cn">
<head>
    <meta content="云之讯,云通讯,云通讯平台" name="keywords"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"/>
    <title>短信云平台运营系统 </title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <link th:href="@{/resources/css/bootstrap.min14ed.css?v=3.3.6}" rel="stylesheet">
    <link th:href="@{/resources/css/font-awesome.min93e3.css?v=4.4.0}" rel="stylesheet"><!-- jqgrid-->
    <link th:href="@{/resources/js/plugins/jqgrid/css/ui.jqgrid-bootstrap.css}" rel="stylesheet">
    <link th:href="@{/resources/css/animate.min.css}" rel="stylesheet">
    <link th:href="@{/resources/css/style.min862f.css?v=4.1.0}" rel="stylesheet">
    <link th:href="@{/resources/css/plugins/sweetalert/sweetalert.css}" rel="stylesheet">
    <link th:href="@{/resources/css/doublebox-bootstrap.css}" rel="stylesheet">

    <style>
        /* Additional style to fix warning dialog position */
        #alertmod_table_list_2 {
            top: 900px !important;
        }

        .ue-container {
            margin: 0 auto;
            margin-top: 3%;
            padding: 20px 40px;
            border: 1px solid #ddd;
            background: #fff;
        }

        /*.bootstrap-duallistbox-container .btn-box{*/
        /*margin-top: 39px !important;*/
        /*}*/
        .modal-content {
            opacity: 1 !important;
            border: none;
        }

        .bootstrap-duallistbox-container label {
            text-align: center;
        }

        .filter {
            text-align: center;
        }

        .demo {
            height: 322px !important;
        }
    </style>
</head>
<body class="gray-bg">
<div th:replace="stat :: statCode"></div>
<div class="wrapper wrapper-content  animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="tabs-container">
                <ul class="nav nav-tabs">
                    <li class="active" id="agentTab" th:if="${menus.zkgl}">
                        <a data-toggle="tab" href="#tab-1" aria-expanded="true">直客管理</a>
                    </li>
                    <li class="" th:if="${menus.dlszkhgl}">
                        <a href="/accountInfo/client/query" id="tab-2">子账户管理</a>
                    </li>
                    <li class="" th:if="${menus.khzgl}">
                        <a href="/accountInfo/clientgroup/query" id="tab-3">客户组管理</a>
                    </li>
                </ul>
                <div class="tab-content">
                    <div class="tab-pane active" th:if="${menus.zkgl}">
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="ibox ">
                                        <div class="ibox-content">
                                            <input type="hidden" th:value="${jsmsMenu.menuId}" id="menuId">
                                            <form role="form" class="form-inline" id="mainForm"
                                                  method="post">
                                                <div class="form-group">
                                                    <!-- <label for="example1" class="sr-only">用户名</label> -->
                                                    <input type="text" placeholder="客户ID/客户名称/手机号码/销售名字"
                                                           id="condition"
                                                           name="condition"
                                                           class="form-control" style="width:248px">
                                                </div>
                                                <div class="form-group">
                                                    <label for="star_level">客户等级:</label>
                                                    <select id="star_level" class="form-control"
                                                            name="star_level">
                                                        <option value="">全部</option>
                                                        <option value="1">1星</option>
                                                        <option value="2">2星</option>
                                                        <option value="3">3星</option>
                                                        <option value="4">4星</option>
                                                        <option value="5">5星</option>
                                                    </select>
                                                </div>
                                                <div class="form-group">
                                                    <label for="status">客户状态:</label>
                                                    <select id="status" class="form-control" name="status">
                                                        <option value="">全部</option>
                                                        <option value="1" selected="selected">已启用</option>
                                                        <option value="5">已冻结</option>
                                                        <option value="6">已注销</option>
                                                        <option value="7">已锁定</option>
                                                    </select>
                                                </div>
                                                <div class="form-group">
                                                    <label for="extValueID">是否支持子客户:</label>
                                                    <select id="extValueID" class="form-control"
                                                            name="extValue">
                                                        <option value="">所有</option>
                                                        <option value="1">支持</option>
                                                        <option value="0">不支持</option>
                                                    </select>
                                                </div>
                                                <div class="form-group">
                                                    <label for="charge_rule">计费规则:</label>
                                                    <select id="charge_rule" class="form-control"
                                                            name="charge_rule">
                                                        <option value="">所有</option>
                                                        <option value="0">提交量</option>
                                                        <option value="1">成功量</option>
                                                        <option value="2">明确成功量</option>
                                                    </select>
                                                </div>
                                                <div class="form-group">
                                                    <label for="paytype">付费类型:</label>
                                                    <select id="paytype" class="form-control"
                                                            name="paytype">
                                                        <option value="">所有</option>
                                                        <option value="0">预付</option>
                                                        <option value="1">后付</option>
                                                    </select>
                                                </div>
                                                <!-- 时间选择 -->
                                                <div class="form-group" id="sandbox-container">
                                                    <div class="form-group pull-right"><span
                                                            style="font-weight:700">创建时间:</span>
                                                        <input placeholder="起始时间"
                                                               class="form-control layer-date"
                                                               id="start_time_day"
                                                               name="start_time_day" style="width:102px;"/>至
                                                        <input placeholder="截止时间"
                                                               class="form-control layer-date"
                                                               id="end_time_day"
                                                               name="end_time_day" style="width:102px;"/>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                            <span>&nbsp;&nbsp;<button type="button" class="btn btn-sm btn-danger"
                                                      onclick="search()">搜索</button></span>
                                                    <span>&nbsp;&nbsp;<a href="javascript:;"
                                                                         class="btn btn-sm btn-primary"
                                                                         onclick="reset()">重置</a></span>
                                                    <span>&nbsp;&nbsp;<button type="button"
                                                                              class="btn btn-sm btn-primary hide"
                                                                              onclick="exportExcel()"
                                                                              data-menuId='6027'>导出Excel</button></span>
                                                </div>
                                            </form>
                                        </div>
                                        <div class="ibox-content">
                                            <div class="jqGrid_wrapper">
                                                <table id="table_list"></table>
                                                <div id="pager_list"></div>
                                            </div>
                                            <p>&nbsp;</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script th:src="@{/resources/js/jquery.min.js?v=2.1.4}"></script>
<script th:src="@{/resources/js/bootstrap.min.js?v=3.3.6}"></script>
<script th:src="@{/resources/js/content.min.js?v=1.0.0}"></script>
<script th:src="@{/resources/js/plugins/layer/laydate/laydate.js}"></script>
<script th:src="@{/resources/js/plugins/peity/jquery.peity.min.js}"></script>
<script th:src="@{/resources/js/plugins/jqgrid/js/i18n/grid.locale-cn.js}"></script>
<script th:src="@{/resources/js/plugins/jqgrid/js/jquery.jqGrid.min.js}"></script>
<script th:src="@{/resources/js/date_format.min.js?v=1.0.0}"></script>
<script th:src="@{/resources/js/plugins/sweetalert/sweetalert.min.js}"></script>
<script th:src="@{/resources/js/common.js?v=1.1.0}"></script>
<script th:src="@{/resources/js/layer/layer.js}"></script>
<script th:src="@{/resources/js/doublebox-bootstrap.js}"></script>
<script th:inline="javascript">
    /*<![CDATA[*/
    var menus = [[${menus}]];
    if (menus.zkgl) {

    } else if (menus.dlszkhgl) {
        $("#tab-2")[0].click();
//        document.getElementById("zzhkh").click();
    } else if (menus.khzgl) {
        $("#tab-3")[0].click();
//        document.getElementById("khkh").click();

    }
    var start = {
        elem: "#start_time_day",
        format: "YYYY-MM-DD",
        min: halfYearAgo("yyyy-MM-dd"),
        max: laydate.now(),
        istoday: true,
        choose: function (datas) {
            end.min = datas;
        }
    };
    var end = {
        elem: "#end_time_day",
        format: "YYYY-MM-DD",
        min: halfYearAgo("yyyy-MM-dd"),
        max: laydate.now(),
        istoday: true,
        choose: function (datas) {
            start.max = datas;
        }
    };
    laydate(start);
    laydate(end);

    function reset() {
        $("#mainForm").find("input").val("");
        $("#mainForm").find("select").val("");
    }

    function search() {

        $("#table_list").jqGrid('setGridParam', {
            datatype: 'json',
            postData: {
                condition: $("#condition").val(),
                paytype: $("#paytype").val(),
                charge_rule: $("#charge_rule").val(),
                start_time_day: $("#start_time_day").val(),
                end_time_day: $("#end_time_day").val(),
                extValue: $("#extValueID").val(),
                status: $("#status").val(),
                starLevel: $("#star_level").val()
            }, //发送数据
            page: 1
        }).trigger("reloadGrid"); //重新载入
    }


    $(document).ready(function () {
        $.jgrid.defaults.styleUI = "Bootstrap";
        $("#table_list").jqGrid({
            url:/*[[@{/accountInfo/directclient/list}]]*/,
            mtype: 'POST',
            datatype: "json",
            postData: {
                status: $("#status").val()
            },
            jsonReader: {
                root: "list",
                page: "currentPage",
                total: "totalPage",
                records: "totalCount"
            },
            height: 'auto',
            rownumbers: true,
            autowidth: true,
            shrinkToFit: false,
            autoScroll: true,
            rowNum: 20,
            rowList: [10, 20, 30, 50],
//            colNames: ["客户ID", "客户名称", "手机号码", "客户状态", "认证状态", "所属销售","标记（隐藏）","状态（隐藏）","短信协议类型", "短信类型", "付费类型","是否支持子客户","创建时间" ,"操作"],
            colModel: [
                {label: '客户ID', name: "clientid", align: "left", sortable: false},
                {label: '客户名称', name: "name", align: "left", sortable: false},
                {label: '客户等级', name: "starLevelStr", align: "left", sortable: false},
                {label: '手机号码', name: "mobile", align: "left", sortable: false},
                {label: '客户状态', name: "statusName", align: "left", sortable: false},
                {label: '认证状态', name: "oauthStatusDesc", align: "left", sortable: false},
                {label: '所属销售', name: "userRealName", align: "left", sortable: false},
                {label: '标记（隐藏）', name: "flag", align: "left", sortable: false, hidden: true},
                {label: '状态（隐藏）', name: "ext_value", align: "left", sortable: false, hidden: true},
                {label: '短信协议类型', name: "smsfromDesc", align: "left", sortable: false},
                {label: '短信类型', name: "smstypeDesc", align: "left", sortable: false},
                {label: "计费规则", name: "valueStr", align: "left", sortable: false, width: 120},
                {label: '付费类型', name: "paytypeDesc", align: "left", sortable: false},
                {label: '是否支持子客户', name: "extValueStr", align: "left", sortable: false},
                {label: '创建时间', name: "createtime", align: "left", sortable: false},
                {
                    label: '操作',
                    name: "total",
                    index: "total",
                    align: "left",
                    sortable: false,
                    title: false,
                    width: 400,
                    formatter: function (cellvalue, options, rowObject) {

                        var clientid = rowObject.clientid;
                        var name = rowObject.name;
                        var status = rowObject.status;
                        var oauth_status = rowObject.oauthStatusDesc;
                        var flag = rowObject.flag;
                        var ext_value = rowObject.extValueStr;
                        var switcher = '';
                        //5:冻结 ; 1:解冻; 6:注销
                        switcher = "<button type='button' class='btn btn-link btn-xs  hide' onclick=\"view('" + clientid + "')\" title='查看' data-menuId='6018'>查看</button>";
                        switcher += "<button type='button' class='btn btn-link btn-xs hide' onclick=\"updateData('" + clientid + "')\" title='编辑' data-menuId='6019'>编辑</button>";
                        switcher += "<button type='button' class='btn btn-link btn-xs hide' onclick=\"chargeRule('" + clientid + "','" + name + "','" + paytype + "')\" title='修改计费' data-menuId='6020'>修改计费</button>";
                        if (status != 5 && status != 6)
                            switcher += "<button type='button' class='btn btn-link btn-xs hide'  onclick=\"updateStatus('" + name + "','" + clientid + "','5')\" title='冻结' data-menuId='6021'>冻结</button>";
                        if (status == 5)
                            switcher += "<button type='button' class='btn btn-link btn-xs hide'  onclick=\"updateStatus('" + name + "','" + clientid + "','1')\" title='解冻' data-menuId='6022'>解冻</button>";
                        if (status != 6)
                            switcher += "<button type='button' class='btn btn-link btn-xs hide'  onclick=\"updateStatus('" + name + "','" + clientid + "','6')\" title='注销' data-menuId='6023'>注销</button>";
                        if (oauth_status == '待认证' && flag > 0) {
                            switcher += "<button type='button' class='btn btn-link btn-xs hide' onclick=\"Auditing('" + clientid + "')\" title='审核资质' data-menuId='6026'>审核资质</button>";
                        }
                        if (oauth_status == '待认证' && flag == 0 || oauth_status == '认证不通过') {
                            switcher += "<button type='button' class='btn btn-link btn-xs hide' onclick=\"uploadAptitude('" + clientid + "')\" title='上传资质' data-menuId='6025'>上传资质</button>";
                        }
                        if (status != 6 && ext_value == '支持')
                            switcher += "<button type='button' class='btn btn-link btn-xs hide'  onclick=\"manageSub('" + name + "','" + clientid + "','6')\" title='管理子账户' data-menuId='6024'>管理子账户</button>";
                        return switcher;
                    }
                }
            ],
            pager: "#pager_list",
            viewrecords: true,
            hidegrid: false,
            gridComplete: function () {
                var menuId = $("#menuId").val();
                checkMenu(menuId);
            }
        });

        $(window).bind("resize", function () {
            var width = $(".jqGrid_wrapper").width();
            $("#table_list").setGridWidth(width);
        })


        function keyUp(e) {
            var currKey = 0, e = e || event;
            currKey = e.keyCode || e.which || e.charCode;
            var keyName = String.fromCharCode(currKey);
            if (currKey == 13) {
                search();
            }
        }

        document.onkeyup = keyUp;

    });

    function updateStatus(name, clientid, status) {
        var statuName = "冻结";
        switch (status) {
            case "5":
                statuName = "冻结";
                break;
            case "1":
                statuName = "解冻";
                break;
            case "6":
                statuName = "注销";
                break;
        }
        swal({
            title: "您确定要" + statuName + "客户【" + name + "】",
            text: "",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: statuName,
            cancelButtonText: "让我再考虑一下…",
            closeOnConfirm: false
        }, function () {
            $.ajax({
                url:/*[[@{/accountInfo/directclient/updateStatus}]]*/,
                type: "POST",
                data: {
                    clientId: clientid,
                    status: status
                },
                success: function (data) {
                    if (data == null) {
                        swal("失败！", "系统错误，请稍后再试！", "error")
                    } else if (data.success == true) {
                        swal("成功！", data.msg, "success")
                    } else {
                        swal("失败！", data.msg, "error")
                    }
                    search();
                }
            });
        });
    }

    //编辑
    function updateData(clientid) {
        var viewUrl = /*[[@{/accountInfo/directclient/edit}]]*/;
        window.location.href = viewUrl + "?clientId=" + clientid;
    }

    //修改计费
    //修改计费
    function chargeRule(clientid, clientname, paytype) {
        var url = /*[[@{/accountInfo/changeRule}]]*/;
        layer.open({
            type: 2,
            title: "修改【" + clientid + "-" + clientname + "】计费规则",
            closeBtn: 2,
            area: ['770px', '400px'],
            fix: false, //不固定
            content: url + "?clientId=" + clientid + "&paytype=" + paytype
        });
    }

    var max_export_num = /*[[${max_export_num}]]*/;

    //导出Excel文件
    function exportExcel() {
        var totalCount = $("#table_list").jqGrid('getGridParam', 'records');
        if (totalCount == 0) {
            layer.msg("共0条记录，将不导出Excel文件", {icon: 2});
            return;
        }
        if (totalCount > max_export_num) {
            layer.msg("导出Excel文件条数大于" + max_export_num + "条", {icon: 2});
            return;
        }
        var mainForm = $("#mainForm");
        var action = mainForm.attr("action");
        var exporUrl = /*[[@{/accountInfo/directclient/exportExcel}]]*/;
        mainForm.attr("action", exporUrl).submit();
        mainForm.attr("action", action);
    }

    function view(clientid) {
        var viewUrl = /*[[@{/accountInfo/directclient/view}]]*/;
        window.location.href = viewUrl + "?clientId=" + clientid;
    }

    function Auditing(clientid) {
        var viewUrl = /*[[@{/opsAudit/customer/view}]]*/;
        window.location.href = viewUrl + "?clientId=" + clientid + "&type=" + 11;
    }

    function uploadAptitude(clientid) {
        var url = /*[[@{/accountInfo//qualification/save}]]*/;
        window.location.href = url + "?clientid=" + clientid + "&type=" + 1;
    }


    // 管理子账户
    function manageSub(name, clientid, status) {
        var url = /*[[@{/accountInfo/subclient/list}]]*/;
        layer.open({
            type: 2,
            shadeClose: true,
            title: '',
            content: [url + "?clientId=" + clientid + '&name=' + name, 'no'],
            area: ['900px', '700px']
        });


    }

    /*]]>*/
</script>
</body>
</html>